<%@page isELIgnored="false" pageEncoding="UTF-8" contentType="text/html; UTF-8" %>
    <script type="text/javascript">
        $(function () {
            $('#ssCatelog').searchbox({
                searcher:function(value,name){
                    $("#ttCatelog").treegrid("load",{
                        "columnName":name,
                        "columnValue":value,
                    });
                },
                width:300,
                menu:'#mmCatelog',
                prompt:'请输入值',
            });

            $("#ttCatelog").treegrid({
                url: "${pageContext.request.contextPath}/back/catelog/findAll",
                autoRowHeight: true,
                idField:'id',
                treeField:'text',
                fit:true,
                fitColumns: true,
                animate:true,
                //lines:true,
                toolbar: '#tbCatelog',
                columns: [[
                    {field: "checkbox", checkbox: true},
                    {title: "名称", field: "text", width: 100},
                    {title: "图片", field: "picture", width: 100,
                        formatter: function (value, row, index) {
                            return "<img style='width:80px;height:80px;border-radius:10px;display:block;' src='${pageContext.request.contextPath}/"+row.picture+"'/>";
                        }
                    },


                    {
                        title: "操作", field: "options", width: 100, formatter: function (value, row, index) {
                            return "<a onclick=showCatelog(\""+row.id+"\") class='btnCatelog' data-options=\"iconCls:'icon-edit',\">更新</a>";
                        }
                    }
                ]],
                pagination: true,
                checkOnSelect: true,
                selectOnCheck: true,
                pageList:[3,10,20,40,80,100],
                pageSize:3,
                onLoadSuccess: function () {
                    $(".btnCatelog").linkbutton();

                }
            });
        });

        //打开添加对话框
        function openAddCatelogDialog() {
            $("#addCatelogDialog").dialog({
                title:"添加分类信息",
                iconCls:'icon-save',
                width:600,
                height:400,
                modal:true,
                href:"${pageContext.request.contextPath}/back/catelog/add.jsp",
                buttons:[{
                    text:'保存',
                    iconCls:'icon-save',
                    handler:saveCatelog,
                },{
                    text:'关闭',
                    iconCls:'icon-cancel',
                    handler:function(){
                        $("#addCatelogDialog").dialog("close");
                    }
                }]
            });
        }
        //保存分类信息
        function saveCatelog(){
            $('#saveCatelogForm').form({
                url:'${pageContext.request.contextPath}/back/catelog/add',
                onSubmit: function(){
                        return $("#saveCatelogForm").form("validate");
                },
                success:function(result){
                    result = eval("("+ result +")");
                    $.messager.show({
                        title:'提示信息',
                        msg:result.message,
                        timeout:5000,
                        showType:'slide'
                    });
                    $('#addCatelogDialog').dialog("close");
                    $("#ttCatelog").treegrid("reload");
                }
            });
            $('#saveCatelogForm').submit();
        }
        //更新分类信息
        function updateCatelog(){
            $('#updateCatelogForm').form({
                url:'${pageContext.request.contextPath}/back/catelog/update',
                onSubmit: function(){
                        return $("#updateCatelogForm").form("validate");
                },
                success:function(result){
                    result = eval("("+ result +")");
                    $.messager.show({
                        title:'提示信息',
                        msg:result.message,
                        timeout:5000,
                        showType:'slide'
                    });
                    $('#updateCatelogDialog').dialog("close");
                    $("#ttCatelog").treegrid("reload");
                }
            });
            $('#updateCatelogForm').submit();
        }
        //展示分类信息
        function showCatelog(id){

            $("#updateCatelogDialog").dialog({
                title:"更新分类信息",
                iconCls:'icon-edit',
                width:600,
                height:400,
                modal:true,
                href:"${pageContext.request.contextPath}/back/catelog/update.jsp",
                buttons:[{
                    text:'保存',
                    iconCls:'icon-save',
                    handler:updateCatelog,
                },{
                    text:'关闭',
                    iconCls:'icon-cancel',
                    handler:function(){
                        $("#updateCatelogDialog").dialog("close");
                    }
                }],
                onLoad:function(){
                    $("#updateCatelogForm").form('load','${pageContext.request.contextPath}/back/catelog/findOne?id='+id);
                    var t = setInterval(function () {
                        if($("#cateloglogoPath").val()){
                            $("#picture").attr("src","${pageContext.request.contextPath}/"+$("#cateloglogoPath").val());
                            window.clearInterval(t);
                        }
                    },1);
                    var m = setInterval(function () {
                        if($("#catelogId").val()){
                            $('#ctUpdateCatelog').combotree({
                                url: '${pageContext.request.contextPath}/back/catelog/findAllCatelogWithoutMyself?id='+$("#catelogId").val(),
                                width:250,
                                height:40,
                            });
                            window.clearInterval(m);
                        }
                    },1);
                }
            });
        }
    </script>

<table id="ttCatelog" style="width:600px;height:400px"></table>
<div id="tbCatelog">
    <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-add',plain:true,onClick:openAddCatelogDialog,">添加</a>

    <input id="ssCatelog"></input>
    <div id="mmCatelog" style="width:120px">
        <div data-options="name:'name',iconCls:'icon-ok'">名称</div>
    </div>
</div>


<%--添加对话框--%>
<div id="addCatelogDialog"></div>
<%--更新对话框--%>
<div id="updateCatelogDialog"></div>
